<html>
	<head>
		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
		<meta name="apple-mobile-web-app-capable" content="yes"/>
		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> 
	
		<script src="${resource(file:'sencha-touch.js', dir:'plugin/sencha-touch-1.1.0') }"></script>
		<script src="${resource(file:'iscroll-min.js', dir:'plugin/iscroll') }"></script>
		<link rel="stylesheet" href="${resource(file:'iphone.css', dir:'css')}" type="text/css" media="all" />
	</head>
	<style>
		
	</style>
	
	<body>
		<form name="form">
			<input type="text" id="msg"/>
		</form>
		<a id="snd" href="javascript:void(0)">
			<span style="background-color: #F00; width:50px; height:50px;display:block;">
			Send Message
			</span>
		</a>
		<div id="console" style="width:150px;height:200px;float:left;position: relative;overflow: hidden;"></div>
		<div id="chat" style="width:300px;float:left;"></div>
		<script type="text/javascript" src="${resource(file:'jquery-1.5.2.min.js', dir:'plugin/jquery') }"></script>
		<script type="text/javascript" src="${resource(file:'stomp.js', dir:'plugin/stomp') }"></script>
		<script type="text/javascript">
			if(!("WebSocket" in window)){
				alert("WebSocket not supported");
			}
			$(function(){
				var url = "ws://192.168.0.100:61614";
				var client = Stomp.client(url);
				client.debug = function(str){
					$("#console").append("<p>" + str + "</p>");
				};				
				var onConnect = function(){
					$("#console").append("<p>Connected</p>")
					client.subscribe("/topic/chat", function(message){
						$("#chat").append("<p>" + message.body + "</p>");
					});
				};
				var onError = function(error){
					$("#console").append("<p>Failed to connect</p>");
					$("#console").append(error);
				};
				
				client.connect('guest', 'guest', onConnect, onError);
								
				$("#snd").click(function(){
					var msg = $("#msg");
					client.send("/queue/do", {priority: 9}, msg.val());
				});			
			})
		</script>
	</body>
</html>